<template>
  <div>
    <div class="grids columns">
      <div class="item">
        <div class="title textCenter">1.教学目的与要求</div>
        <el-input v-model="model.requirement" :rows="13" type="textarea" placeholder="请输入" />
      </div>
      <div class="item">
        <div class="title textCenter">2.教学重点</div>
        <el-input v-model="model.aKey" :rows="13" type="textarea" placeholder="请输入" />
      </div>
      <div class="item">
        <div class="title textCenter">
          3.教学难点
        </div>
        <el-input v-model="model.difficulty" :rows="13" type="textarea" placeholder="请输入" />
      </div>
      <div class="item">
        <div class="title textCenter">
          4.执行后记
        </div>
        <el-input v-model="model.afterword" :rows="13" type="textarea" placeholder="请输入" />
      </div>
    </div>

    <div class="actionBtn flex justifyEnd">
      <el-button type="primary" @click="save" :loading="loading">确定</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
let props = defineProps(["info", "type", "archiveBinding"]);
const { proxy } = getCurrentInstance();

let model = ref({
  requirement: "",
  aKey: "",
  difficulty: "",
  afterword: "",
});
let loading = ref(false);
let templateUrl = "";

onMounted(() => {
  getTemplateUrl();
});

async function getInfo() {
  let resp = await proxy.$apis.classReport({
    type: "B7-details",
    data: { classId: props.info._id },
  });
  if (resp) {
    model.value = proxy.$utils.formatFunction(resp, { ...model.value });
  } else if (props.archiveBinding && props.archiveBinding.length) {
    let res = await proxy.$apis.scheduleRelevant({
      type: "archives-teaching-details",
      data: { archivesId: props.archiveBinding[0]._id },
    });
    model.value.requirement = res.instructionalObjective;
    model.value.aKey = res.teachingFocus;
    model.value.difficulty = res.teachingDifficulties;
    model.value.afterword = res.executionAfterword;
  }
}

async function save() {
  try {
    loading.value = true;
    await proxy.$apis.classReport({
      type: "B7-save",
      data: {
        classId: props.info._id,
        ...model.value,
      },
    });
    proxy.$utils.showToast("保存成功");
    getInfo();
  } catch (error) {
  } finally {
    loading.value = false;
  }
}

async function getTemplateUrl() {
  templateUrl = await proxy.$apis.fileTemplate({
    data: { type: props.type },
    type: "downLoad",
  });
}

async function exportWord() {
  if (!templateUrl) return proxy.$utils.showToast("请先上传模板", 0);
  let ret = await proxy.$apis.classDocExport({
    templateURL: templateUrl,
    data: model.value,
    fileName: "教学分析及执行后记.docx",
  });
  window.location.href = ret;
}

function downLoadTemplate() {
  window.location.href = templateUrl;
}

watch(
  () => [props.info, props.archiveBinding],
  (newValue, oldValue) => {
    if (newValue) getInfo();
  },
  { deep: true, immediate: true }
);

defineExpose({
  exportWord,
  downLoadTemplate,
  getTemplateUrl,
});
</script>



<style lang="scss" scoped>
.columns {
  gap: 0 20px; //上下间距 左右间距
}
.title {
  margin-bottom: 15px;
}
.actionBtn {
  margin-top: 25px;
}
</style>
